<mat-card class="example mat-elevation-z16">
  <mat-card-content>
    <div class="example2">
      <div class="sample">
        <header>TODO</header>
        <ng-scrollbar appearance="compact"
                      (updated)="onScrollbarUpdate()">
          <ul>
            <li></li>
            <li *ngFor="let item of list"
                [class.not]="!item.completed"
                [class.ok]="item.completed">{{item.title}}</li>
            <li></li>
          </ul>
        </ng-scrollbar>
      </div>
    </div>
  </mat-card-content>
  <mat-card-actions align="end">
    <button mat-raised-button color="accent" (click)="addItem()">Add Task</button>
  </mat-card-actions>
</mat-card>
